<!--订单详情-->
<template>
  <div>
    <van-nav-bar title="订单详情" left-arrow @click-left="onClickLeft" :border="false" v-if="this.hasPay==undefined || this.hasPay==null">
      <van-icon name="arrow-left" slot="left" color="#000" size="20" />
    </van-nav-bar>
    <van-nav-bar title="订单详情" left-arrow @click-left="goBack" :border="false" v-else>
      <van-icon name="arrow-left" slot="left" color="#000" size="20" />
    </van-nav-bar>
    <div style="width:100%;height:10px;background-color:#F8F8F8"></div>
    <div class="wrap" v-if="detailInfo.ordersState==1">
      <img src="../../../../../static/img/mn/one.png" alt width="100%" height="50px" />
    </div>
    <div class="wrap" v-if="detailInfo.ordersState==2">
      <img src="../../../../../static/img/mn/two.png" alt width="100%" height="50px" />
    </div>
    <div class="wrap" v-if="detailInfo.ordersState==3">
      <img src="../../../../../static/img/three.png" alt width="100%" height="50px" />
    </div>
    <div class="wrap" v-if="detailInfo.ordersState==4">
      <img src="../../../../../static/img/four.png" alt width="100%" height="50px" />
    </div>
    <div class="wrap" v-if="detailInfo.ordersState==6 || detailInfo.ordersState==7">
      <img src="../../../../../static/img/five.png" alt width="100%" height="50px" />
    </div>
    <div class="wrap" v-if="detailInfo.ordersState==5">
      <div style="font-size:16px;font-weight:bold;color:#333333;">买家申请退款，需要卖家处理</div>
      <div style="color:#333333;font-size:12px;vertical-align:middle;margin-top:10px;">    
        <span >
           <van-count-down :time="detailInfo.getTime*60*1000" format="DD天HH时mm分" style="font-size:12px;display:inline-block" />
        </span>
        <span>后未处理，退款将自动返还买家。</span>
      </div>
    </div>
    <div class="wrap" v-if="detailInfo.ordersState==8">
      <span style="font-size:16px;font-weight:bold;color:#333333;">退款成功</span>
    </div>
    <div class="wrap" v-if="detailInfo.ordersState==9 && isSeller">
      <span style="font-size:16px;font-weight:bold;color:#333333;">买家未及时付款，交易已关闭</span>
    </div>
    <div class="wrap" v-if="detailInfo.ordersState==9 && isBuyer">
      <span style="font-size:16px;font-weight:bold;color:#333333;">因交易超时，系统关闭了该笔交易</span>
    </div>
    <div class="wrap" v-if="detailInfo.ordersState==10">
      <span style="font-size:16px;font-weight:bold;color:#333333;">买家关闭了这笔交易</span>
    </div>
    <div class="wrap" v-if="detailInfo.ordersState==0">
      <span style="font-size:16px;font-weight:bold;color:#333333;">卖家关闭了这笔交易</span>
    </div>
    <floor1
      v-if="detailInfo.ordersState==1 && isBuyer"
      :detailInfo="detailInfo"
      :expressDetail="expressDetail"
      :isBuyer="isBuyer"
      :isSeller="isSeller"
      :goodsId="goodsId"
		  :nickName="nickName"
		  :buyerId="buyerId"
      :sellerId="sellerId"
      :goodsCoverUrl="goodsCoverUrl"
      :avatar="avatar"
      :savatar="savatar"
      :groupid="groupid"
      :groupidExist="groupidExist"
    ></floor1>

    <!-- 不用 -->
    <!-- <floor27 :detailInfo="detailInfo" :h="h" :m="m" v-if="detailInfo.ordersState==1&&isSeller"></floor27> -->

    <floor11 
      :detailInfo="detailInfo" 
      :isBuyer="isBuyer" 
      :isSeller="isSeller" 
      v-if="detailInfo.ordersState==2 || detailInfo.ordersState==3 || detailInfo.ordersState==1 && isSeller || detailInfo.ordersState==4 || detailInfo.ordersState==5 || detailInfo.ordersState==6 || detailInfo.ordersState==0 || detailInfo.ordersState==10 || detailInfo.ordersState==9 || detailInfo.ordersState==7 || detailInfo.ordersState==8"
    ></floor11>

    <floor2
      v-if="detailInfo.ordersState==1 && isSeller"
      :detailInfo="detailInfo"
      :expressDetail="expressDetail"
      :isBuyer="isBuyer"
      :isSeller="isSeller"
      :goodsId="goodsId"
		  :nickName="nickName"
		  :buyerId="buyerId"
      :sellerId="sellerId"
      :goodsCoverUrl="goodsCoverUrl"
      :avatar="avatar"
      :savatar="savatar"
    ></floor2>

    <!-- 不用 -->
    <!-- <floor28
      :detailInfo="detailInfo"
      :receivingTime="receivingTime"
      v-if="detailInfo.ordersState==3"
    ></floor28> -->

    <!-- <floor30
      :detailInfo="detailInfo"
      :evaluateTime="evaluateTime"
      v-if="detailInfo.ordersState==4&&isBuyer"
    ></floor30> -->

    <!-- <floor31
      :detailInfo="detailInfo"
      :evaluateTime="evaluateTime"
      v-if="detailInfo.ordersState==4&&isSeller"
    ></floor31> -->

    <!-- <floor32
      :detailInfo="detailInfo"
      :evaluateTime="evaluateTime"
      :isBuyer="isBuyer"
      :isSeller="isSeller"
      v-if="detailInfo.ordersState==6"
    ></floor32> -->

    <!-- <floor29 v-if="detailInfo.ordersState==3||detailInfo.ordersState==4"></floor29> -->

    <floor10
      v-if="addressSite!='' && detailInfo.ordersState!=1"
      :detailInfo="detailInfo"
      :expressDetail="expressDetail"
      :isBuyer="isBuyer"
      :isSeller="isSeller"
      :addressSite="addressSite"
      :goodsId="goodsId"
		  :nickName="nickName"
		  :buyerId="buyerId"
      :sellerId="sellerId"
      :goodsCoverUrl="goodsCoverUrl"
      :avatar="avatar"
      :savatar="savatar"
      :groupid="groupid"
      :expressCode="expressCode"
      :expressSn="expressSn"
      :company="company"
      :expressInfo="expressInfo"
      :groupidExist="groupidExist"
    ></floor10>

    <floor10
      v-if="addressSite=='' && detailInfo.ordersState!=1"
      :detailInfo="detailInfo"
      :expressDetail="expressDetail"
      :isBuyer="isBuyer"
      :isSeller="isSeller"
      :goodsId="goodsId"
		  :nickName="nickName"
		  :buyerId="buyerId"
      :sellerId="sellerId"
      :goodsCoverUrl="goodsCoverUrl"
      :avatar="avatar"
      :savatar="savatar"
      :groupid="groupid"
      :expressCode="expressCode"
      :expressSn="expressSn"
      :company="company"
      :expressInfo="expressInfo"
      :groupidExist="groupidExist"
    ></floor10>
    
    <!-- <div class="btn" @click="torefuse">拒绝退款</div> -->
    
    <div class="footer">
      <!-- 买家 -->
      <div class="btn"  v-if="detailInfo.ordersState==1 && isBuyer" @click="cancelOrder">取消订单</div>
      <div class="btn1" v-if="detailInfo.ordersState==1 && isBuyer" @click="toPay">我要付款</div>
      <div class="btn"  v-if="detailInfo.ordersState==2 && isBuyer " @click="toRefunds">我要退款</div>
      <div class="btn1" v-if="detailInfo.ordersState==2 && isBuyer " @click="remindSell">提醒卖家发货</div>
      <!-- <div class="btn2" v-if="detailInfo.ordersState==2 && isBuyer && detailInfo.refundId!=null" @click="tobRefund">处理退款</div> -->
      <div class="btn"  v-if="detailInfo.ordersState==3 && isBuyer " @click="toRefund">我要退款</div>
      <div class="btn1" v-if="detailInfo.ordersState==3 && isBuyer " @click="confirmGoods">确认收货</div>
      <!-- <div class="btn2" v-if="detailInfo.ordersState==3 && isBuyer && detailInfo.refundId!=null" @click="tobRefund">处理退款</div> -->
      <div class="btn"  v-if="detailInfo.ordersState==4 && isBuyer" @click="tobuyMoney">查看钱款去向</div>
      <div class="btn1" v-if="detailInfo.ordersState==4 && isBuyer" @click="toevaluate">评价</div>
      <div class="btn"  v-if="detailInfo.ordersState==6 && isBuyer" @click="tobuyMoney">查看钱款去向</div>
      <div class="btn1" v-if="detailInfo.ordersState==6 && isBuyer" @click="toSeeevaluate">查看评价</div>
      <div class="btn2" v-if="detailInfo.ordersState==5 && isBuyer" @click="tobRefund">处理退款</div>
      <div class="btn2" v-if="detailInfo.ordersState==8 && isBuyer" @click="tonewMoney">查看钱款去向</div>
      <!-- 卖家 -->
      <div class="btn"  v-if="detailInfo.ordersState==1 && isSeller" @click="close">关闭交易</div>
      <div class="btn1" v-if="detailInfo.ordersState==1 && isSeller" @click="tomodifyPrice">修改价格</div>
      <div class="btn"  v-if="detailInfo.ordersState==2 && isSeller" @click="closeOrder">关闭交易</div>
      <div class="btn1" v-if="detailInfo.ordersState==2 && isSeller" @click="todeliver">去发货</div>
      <div class="btn2" v-if="detailInfo.ordersState==3 && isSeller" @click="remindBuy">提醒买家收货</div>
      <div class="btn"  v-if="detailInfo.ordersState==4 && isSeller" @click="tosellMoney">查看钱款去向</div>
      <div class="btn1" v-if="detailInfo.ordersState==4 && isSeller" @click="toevaluate">评价</div>
      <div class="btn"  v-if="detailInfo.ordersState==6 && isSeller" @click="tosellMoney">查看钱款去向</div>
      <div class="btn1" v-if="detailInfo.ordersState==6 && isSeller" @click="toSeeevaluate">查看评价</div>
      <div class="btn2" v-if="detailInfo.ordersState==5 && isSeller && detailInfo.refundId!=null" @click="tosRefund">处理退款</div>
      <div class="btn2" v-if="detailInfo.ordersState==8 && isSeller" @click="tonewMoney">查看钱款去向</div>
    </div>
  </div>
</template>

<script>
import Floor1 from "_c/markets/order/floor1.vue";
import Floor2 from "_c/markets/order/floor2.vue";
import Floor10 from "_c/markets/order/floor10.vue";
import Floor11 from "_c/markets/order/floor11.vue";
import Floor27 from "_c/markets/order/floor27.vue";
import Floor28 from "_c/markets/order/floor28.vue";
import Floor29 from "_c/markets/order/floor29.vue";
import Floor30 from "_c/markets/order/floor30.vue";
import Floor31 from "_c/markets/order/floor31.vue";
import Floor32 from "_c/markets/order/floor32.vue";
import { getFun, getTimer } from "@/api/publicFun.js";
let publicFun = getFun();
export default {
  name: "orderDetail",
  components: {
    Floor1,
    Floor2,
    Floor10,
    Floor11,
    Floor27,
    Floor28,
    Floor29,
    Floor30,
    Floor31,
    Floor32
  },
  data() {
    return {
      time: 240 * 60 * 60 * 1000,
      isBuyer: false, // 用于绑定是否是买家
      isSeller: false, // 用于绑定是否是卖家
      active: 0,
      url1: this.$api+'/marketorderservice/api/v1/market/orders', // 获取订单详情的接口
      url2: this.$api+'/marketorderservice/api/v1/market/orders/getOrdersExpressInfo',//物流详情
      url3: this.$api+'/marketorderservice/api/v1/market/remindShipping',//提醒发货
      url4: this.$api+'/marketorderservice/api/v1/market/updateCloseOrders',//关闭订单
      url5: this.$api+'/marketorderservice/api/v1/market/updateReceiptOrders',//确认收货
      url6: this.$api + "/marketorderservice/api/v1/market/kuaidi100/searchInfo", // 查询快递状态
      ordersId: "",
      userId: "",
      suserId:'',//卖家id
      refundId:'',
      hasPay:'',//传过来的参数
      detailInfo: {}, // 绑定订单对象
      expressDetail: {},
      expressInfo:[],
      addressSite: "",
      expressCode:"",
      expressSn:"",
      company:'',
      ordersState:'',//订单状态
      goodsId:'',//商品
		  nickName:'',//昵称
		  buyerId:'',//买家
      sellerId:'',//卖家
      goodsCoverUrl:'',//商品图片
      avatar:'',//买家头像
      savatar:'',//卖家头像
      groupid:'',//群Id
      groupidExist:false
    };
  },
  methods: {
    torefuse(){
      let arg='[{"userId":"'+this.sellerId+'"},{"ordersId":"'+this.ordersId+'"},{"refundId":"'+'8e4faaef94f54385934aad37157762bb'+'"}]' 
      this.link('/market/orders/refuse',arg)
    },
    expressdetail(){
      let arg='[{"userId":"'+this.userId+'"},{"ordersId":"'+this.ordersId+'"}]' 
	   	this.link('/market/orders/expressDetail',arg)
    },
    togo(){
      this.$router.go(-1)
    },
    toRefund(){
      let arg='[{"ordersId":"'+this.ordersId+'"}]'
      let url = this.concatUrl('/market/orders/apply',arg)
      this.goNewWin(url);
    },
    toRefunds(){
      let arg='[{"ordersId":"'+this.ordersId+'"}]' 
      let url = this.concatUrl('/market/orders/refund',arg)
      this.goNewWin(url);
    },
    //买家查看钱款去向
    tobuyMoney(){
      let arg='[{"userId":"'+this.userId+'"},{"ordersId":"'+this.ordersId+'"}]' 
	   	this.link('/market/orders/buyMoney',arg)
    },
    tonewMoney(){
      let arg='[{"userId":"'+this.userId+'"},{"ordersId":"'+this.ordersId+'"}]' 
	   	this.link('/market/orders/refundMoney',arg)
    },
    toevaluate(){
      let arg='[{"userId":"'+this.userId+'"},{"ordersId":"'+this.ordersId+'"},{"goodsId":"'+this.goodsId+'"}]' 
	   	this.link('/market/im/evaluate',arg)
    },
    toSeeevaluate(){
      let arg='[{"userId":"'+this.userId+'"},{"ordersId":"'+this.ordersId+'"},{"ordersState":"'+this.ordersState+'"}]' 
	   	this.link('/market/im/seeEvaluate',arg)
    },
    //买家退款详情
    tobRefund(){
      let arg='[{"ordersId":"'+this.ordersId+'"},{"refundId":"'+this.refundId+'"}]'
      let url = this.concatUrl('/market/orders/refunds',arg)
      this.goNewWin(url);
    },
    //卖家退款详情
    tosRefund(){
      let arg='[{"userId":"'+this.userId+'"},{"ordersId":"'+this.ordersId+'"},{"refundId":"'+this.refundId+'"}]' 
	   	this.link('/market/orders/sellrefundDetail',arg)
    },
    //卖家去发货
    todeliver(){
      let arg='[{"ordersId":"'+this.ordersId+'"}]'
      let url = this.concatUrl('/market/deliver/index',arg)
      this.goNewWin(url);
    },
    //卖家关闭退款
    close(){
      let that = this;
      this.$Axios2.Get(this.url4 + "/" + this.ordersId + "/" + 1 + "/" + 1).then(function(res) {
        that.$toast("已成功关闭订单!")
        //   if(res.responseCode==200){
        //   that.$toast("已成功关闭退款!")
        // }else{
        //   that.$toast("关闭退款失败!")
        // }
          that.togo()
        });
    },
    //卖家付款情况下关闭退款
    closeOrder(){
      let that = this;
      this.$Axios2.Get(this.url4 + "/" + this.ordersId + "/" + 1 + "/" + 2).then(function(res) {
        that.$toast("已成功关闭订单!")
        // if(res.responseCode==200){
        //   that.$toast("已成功关闭退款!")
        // }else{
        //   that.$toast("关闭退款失败!")
        // }
          that.togo()
        });
    },
    //卖家查看钱款去向
    tosellMoney(){
      let arg='[{"userId":"'+this.userId+'"},{"ordersId":"'+this.ordersId+'"}]' 
	   	this.link('/market/orders/moneys',arg)
    },
    //修改价格
    tomodifyPrice(){
      let arg='[{"userId":"'+this.userId+'"},{"ordersId":"'+ this.ordersId +'"}]' 
	   	this.link('/market/im/editPrice',arg)
    },
    //获取
    getData() {
      let that = this;
      this.$Axios2
        .Get(this.url1 + "/" + this.ordersId + "/" + this.userId)
        .then(function(res) {
          // 判定是买家还是卖家
          if (res.data.orders.userId == that.userId) {
            that.isBuyer = true;
          }
          if (res.data.orders.suserId == that.userId) {
            that.isSeller = true;
          }
          that.detailInfo = res.data.orders;
          that.ordersState=res.data.orders.ordersState;
          that.refundId = res.data.orders.refundId;
          that.goodsId = res.data.orders.goodsId;
          that.nickName = res.data.orders.nickName;
		      that.buyerId = res.data.orders.userId;
          that.sellerId = res.data.orders.suserId;
          that.goodsCoverUrl = res.data.orders.goodsImage;
          that.avatar = res.data.orders.avatar;//买家头像
          that.savatar = res.data.orders.savatar;//买家头像
          that.groupid = res.data.orders.groupid;
          that.groupidExist = res.data.orders.groupidExist;
          that.getExpress();
        });
    },
    //获取物流
    getExpress() {
      let that = this;
      this.$Axios2
        .Get(this.url2 + "/" + this.ordersId + "/" + this.sellerId)
        .then(function(res) {
          that.expressDetail = res.data.ordersExpressInfo;
          if(res.data.ordersExpressInfo !=null){
            that.addressSite = res.data.ordersExpressInfo.addressSite;
            that.expressCode = res.data.ordersExpressInfo.expressNo;//订单号
            that.expressSn = res.data.ordersExpressInfo.addressName;//快递缩写
            that.company = res.data.ordersExpressInfo.company;//快递名称
          }else{
            that.addressSite=""
          } 
          that.getExpressdetail();
        });
    },
    //获取快递第一项
    getExpressdetail() {
      let that = this;
      let params = {       
        // code: "yuantong",//快递公司编码圆通快递
        // num: "YT4633742031055",//单号
        code: that.expressSn,//快递公司编码
        num: that.expressCode,//单号
      };
      this.$Axios.Post(this.url6, params).then(function(res) {
        if(res.data!=null){
          that.expressInfo = res.data[0];
        }
        });
    },
    //去支付
    toPay(){
      let arg='[{"userId":"'+this.userId+'"},{"ordersId":"'+this.ordersId+'"}]' 
	   	this.link('/market/orderPay/orderInfo',arg)
    },
    //取消订单
    cancelOrder(){
      let that = this;
      this.$Axios2.Get(this.url4 + "/" + this.ordersId + "/" + 2 + "/" + 1).then(function(res) {
        // if(res.responseCode==200){
        //   that.$toast("已成功取消订单!")
        // }else{
        //   that.$toast("取消订单失败!")
        // }
          that.$toast("已成功取消订单!")
          that.getData()
        });
    },
    // 提醒卖家发货
    remindSell() {
      let that = this;
      this.$Axios.Get(this.url3 + "/" + this.ordersId + "/" + 2).then(function(res) {
          if(res.data==true){
            that.$toast("已成功提醒卖家发货!")
          }else{
            that.$toast("今天已提醒过卖家，请勿频繁发送!")
          }
      });
    },
    // 提醒买家收货
    remindBuy() {
      let that = this;
      this.$Axios.Get(this.url3 + "/" + this.ordersId + "/" + 1).then(function(res) {
          if(res.data==true){
            that.$toast("已成功提醒买家收货!")
          }else{
            that.$toast("今天已提醒过买家，请勿频繁发送!")
          }
      });
    },
    //确认收货
    confirmGoods(){
      let that = this;
      this.$Axios.Get(this.url5 + "/" + this.ordersId).then(function(res) {
          if(res.data==true){
            that.$toast("确认收货成功!")
            that.getIm(that.goodsId,that.nickName,that.buyerId,that.sellerId,that.goodsCoverUrl,that.savatar,that.ordersId);
          }else{
            that.$toast(res.messageList[0].message)
          }
      });
    },
    //return
    isFinish(){
      return this.hasPay;
    }
  },
  mixins: [publicFun], //混入
  mounted() {
    this.ordersId = this.$router.currentRoute.query.ordersId;
    this.userId = this.$router.currentRoute.query.userId;
    this.hasPay = this.$router.currentRoute.query.hasPay;
    window.isFinish=this.isFinish
    this.getData();
    // this.getExpress();
    // this.getExpressdetail();
  },
};
</script>

<style scoped="">
.wrap {
  padding: 25px 30px;
  text-align: center;
}
.foot {
  position: fixed;
  bottom: 5px;
  text-align: center;
  margin: 0 auto;
  left: 20%;
}
.footer {
  position: fixed;
  bottom: 0;
  display: flex;
  text-align: center;
  width: 100%;
  font-size: 16px;
}
.btn {
  width: 50%;
  padding: 10px;
  background-color: #e5e5e5;
}
.btn1 {
  width: 50%;
  padding: 10px;
  background-color: #ffd630;
}
.btn2 {
  width: 100%;
  padding: 10px;
  background-color: #ffd630;
  border-right:1px solid #e5e5e5;
}
</style>